<template>
	<view class="container">
		<uni-forms :modelValue="valiFormData" :label-width="100" ref="from" :rules="rules">
			<uni-forms-item label="企业名称" required name="company_name">
				<uni-easyinput v-model="valiFormData.company_name" placeholder="请输入企业名称" />
			</uni-forms-item>
			<uni-forms-item label="联系姓名" required name="contact_name">
				<uni-easyinput v-model="valiFormData.contact_name" placeholder="请输入联系姓名" />
			</uni-forms-item>
			<uni-forms-item label="联系方式" required name="contact_phone">
				<uni-easyinput v-model="valiFormData.contact_phone" placeholder="请输入联系方式" />
			</uni-forms-item>
			<uni-forms-item label="您的需求" required name="description">
				<uni-easyinput type="textarea" v-model="valiFormData.description" placeholder="请输入您的需求" />
			</uni-forms-item>
		</uni-forms>
		<view class="button">
			<button @click="submitForm">提交</button>
		</view>
		<up-toast ref="uToastRef"></up-toast>
	</view>
</template>

<script>
	import {
		categoryList,
		parkList,
		quickRepair
	} from '../../api/reportedMaintenance.js'
	export default {
		data() {
			return {
				show: false,
				valiFormData: {
					company_name: '',
					description: '',
					contact_name: '',
					contact_phone: ''
				},
				categoryData: [],
				parkData: [],
				imageFileList: [],
				rules: {
					company_name: {
						rules: [{
							required: true,
							errorMessage: '请填写企业名称',
						}, ]
					},
					contact_name: {
						rules: [{
							required: true,
							errorMessage: '请填写联系姓名',
						}, ]
					},
					contact_phone: {
						rules: [{
							required: true,
							errorMessage: '请填写联系方式'
						}]
					},
					description: {
						rules: [{
							required: true,
							errorMessage: '请填写您的需求'
						}]
					}
				}
			};
		},
		created() {},
		methods: {
			submitForm() {
				this.$refs.from.validate().then(res => {
					quickRepair(this.valiFormData).then((res) => {
						if (res.code == 2000) {
							this.$refs.uToastRef.show({
								type: 'success',
								icon: false,
								message: "快速对接工单创建成功",
							})
							setTimeout(() => {
								uni.switchTab({
									url: '/pages/index/index'
								})
							}, 2000)
						} 
					})

				}).catch(err => {
					console.log('err', err);
				})
			},
		}
	}
</script>

<style lang="scss">
	.container {
		padding: 25rpx;
		height: 100vh;
	}

	// .example {
	// 	padding: 15px;
	// 	background-color: #fff;
	// }

	// .segmented-control {
	// 	margin-bottom: 15px;
	// }

	// .button-group {
	// 	margin-top: 15px;
	// 	display: flex;
	// 	justify-content: space-around;
	// }

	// .form-item {
	// 	display: flex;
	// 	align-items: center;
	// }

	// .button {
	// 	display: flex;
	// 	align-items: center;
	// 	height: 35px;
	// 	margin-left: 10px;
	// }
	.button {
		display: flex;
		justify-content: center;
		padding-bottom: 40rpx;

		button {
			width: 40%;
			background-color: #ff6e3d;
			border: none;
			padding: 20rpx;
			border-radius: 50rpx;
			color: #fff;
		}

	}
</style>